<template>
  <div v-if="fileUrls && fileUrls.length != 0">
    <div class="clearfloat" >
      <h3 class="title6">图片视频</h3>
      <div class="hwui-pa10">
        <div class="lfloat">
          <picAndVedioPreview :fileUrl="fileUrls"  v-if="fileUrls"></picAndVedioPreview>
        </div>
        <div v-if="noPic" class="hwui-fc-txt5">暂无图片视频资料</div>
      </div>
    </div>
    <div style="margin-top: 30px">
      <h3 class="title6">文档资料</h3>
      <filePreview :fileUrl="fileUrls"></filePreview>
      <div v-if="noText" class="hwui-fc-txt5">暂无文档资料</div>
    </div>
  </div>
</template>

<script>
  import picAndVedioPreview from './picAndVedioPreview.vue'
  import filePreview from './filePreview.vue'
  import fileType from '../fileType.js';
  export default {
    name: "showPicPreview",
    componentName: 'showPicPreview',
    components:{picAndVedioPreview,filePreview},
    mixins:[fileType],
    props: {
      fileUrls:null
    },
    data(){
      return {
        noPic:true,
        noText:true
      }
    },
    watch:{
      fileUrls:{
        handler(v){
          console.log(v)
          this.noFileShow()
        },
        deep:true
      }
    },
    methods: {
      noFileShow(){
        if(this.fileUrls && this.fileUrls.length != 0){
          this.fileUrls.forEach(item => {
            if(!this.isPic(item.fileSuffix) && !this.isVideo(item.fileSuffix)){
              console.log(item.fileSuffix)
              this.noText = false
            }
            if(this.isPic(item.fileSuffix) || this.isVideo(item.fileSuffix)){
              this.noPic = false
            }
          })
        }
      },
    },
    created(){
      this.noFileShow();
    }
  }
</script>

<style scoped>
  .imgSingle img{width: 100px;height: 100px;margin-right: 10px;margin-bottom: 10px}
</style>
<!--0225-->
